作用域（Scope）是指在程式碼中變數（或函數等）的可訪問性和可見性的範圍，一個變量或表達式只在當前的作用域中可用，在其它地方是不可用的。作用域也可以構成層級結構，子作用域可以訪問父作用域，反之則不行。在開始講解作用域之前，我們先來看看今天會聊到的東西。

• 程式語言可分為以下兩種：

  • 靜態作用域
  • 動態作用域

• JavaScript 屬於靜態作用域，其作用範圍有以下三種：

  • 全域作用域（Global Scope）
  • 函式作用域（Function Scope）
  • 區塊作用域（Block Scope）

關於靜態作用域和動態作用域

靜態作用域

• 靜態作用域是根據程式碼的結構和位置來決定變數的作用域的。
• 在靜態作用域中，變數的作用域在編寫程式碼時就已經確定，並在程式碼編譯或解析時建立。
• 靜態作用域的範圍在整個程式中是固定的，不受函數的調用位置或運行時上下文的影響。
• 現在大多數程式語言都屬靜態作用域，如C/C++、C#、Python、Java、JavaScript……

動態作用域

• 動態作用域是根據函數的實際調用來決定變數的作用域的。
• 在動態作用域中，變數的作用域在函數實際被呼叫時動態確定。
• 動態作用域的範圍根據函數的調用堆棧（call stack）決定，
  即最後一個被呼叫的函數中的變數將具有最高的可見性。
• 只有少數程式語言屬靜態作用域

以下是比較靜態作用域和動態作用域的例子：

let x = 10;

function foo() {
  // 如果是靜態作用域，那這個函數中的 x 的作用域是全局範圍
  // 如果是動態作用域，那這個函數中的 x 的作用域取決於誰呼叫它
  console.log(x); 
}

function bar() {
  let x = 20;
  foo();
}


// 如果是靜態作用域，這裡會輸出 10
// 如果是動態作用域，這裡會輸出 20，因為 foo 函數是在 bar 函數中呼叫的，所以它使用了 bar 函數的 x 變數
bar(); 

關於JavaScript中的作用域

前面有提到 JavaScript 是靜態作用域，而其作用範圍有以下三種：全域作用域, 函式作用域, 區塊作用域

全域作用域（Global Scope）

• 全域作用域是最外層的作用域，它包含了整個 JavaScript 程式的執行環境。
• 在全域作用域中宣告的變數通常稱為全域變數，可以在程式的任何地方訪問，且在程式的整個生命週期中都存在。

函式作用域（Function Scope）

• 函式作用域是由函式內部定義的範圍（函式的 {} 內部）。
• 在函式作用域中宣告的變數只能在該函式內訪問。
• JavaScript 中的 var 是函式作用域。

區塊作用域（Block Scope）

• 區塊作用域是指由大括號 {} 定義的區域，如if語句、迴圈和函式。
• 在區塊作用域中宣告的變數只能在該區塊內訪問。
• JavaScript中的 let 和 const 是區塊作用域。
  （在ES6之前，JavaScript只有全域作用域和函式作用域，ES6引入了let和const，才有了區塊作用域）

以下分別使用var和let，比較區塊作用域和函式作用域的例子：

function example() {
  
  if(true) {
    var myVarNum = 10; // 只能在 function 區塊內訪問 myLetNum
    let myLetNum = 20; // 只能在 if 區塊內訪問 myLetNum
  }
  
  console.log(myVarNum); // 輸出 10
  console.log(myLetNum); // 報錯
}

結語

今天談了靜態作用域和動態作用域，
並說了JavaScript中的全域作用域，函式作用域和區塊作用域，
希望寫得還算淺顯易懂。
那我們明天見。